<template lang="pug">
el-dialog(title="创建入库单" :visible.sync="dialog" :before-close="close" append-to-body)
    el-form(:v-model="f" label-position="right" label-width="80px")
        el-form-item.is-required(label="上传文件")
            el-upload(drag action="http://up-z0.qiniu.com" :data="uploadData"
                :file-list="fileDetailUploadList" :on-success="handleDetailUploadSuccess"
                :on-remove="handleDetailRemove" :on-error="handleUploadError" :before-upload="handleBeforUpload"
                list-type="picture-card")
                    .el-upload__text 将文件拖到此处，或
                        em 点击上传
                    .el-upload__tip(slot="tip") 只能上传EXCEL文件
    .dialog-footer(slot="footer")
        el-button(@click="close") 取消
        el-button(type="primary" @click="save") 确定
</template>
<script>
import moment from 'moment'
import goodslist from 'components/GoodsLists'
import { assertExpressionStatement } from 'babel-types';
export default{
    data(){
        return{
            shiro:this.$store.state.shiro,
            dialog:false,
            shopID:'',
            f:{},
            uploadData:{
                key: '',
                token: ''
            },
            fileDetailUploadList:[],
        }
    },
    components:{
        goodslist
    },
    computed:{
        getstate(){
            return this.$store.state.createrukuclass;
        }
    },
    watch:{
        getstate(val){
            this.dialog=val
        }
    },
    mounted(){
        if(!this.$store.state.shiro){
            if(this.$store.state.TOPshopID){
                this.shopID=this.$store.state.TOPshopID
            }
        }
    },
    methods:{
        close(){
            this.f={}
            this.shopID=''
            this.fileDetailUploadList=[]
            this.$store.state.createrukuclass=false
        },
        qiniuyunup(_vm, file) {
            // console.log(file)
            var re=new RegExp("(.xlsx)$")
            if (re.test(file.name.toLowerCase())) {
                return true
            }else{
                this.$message.error("请上传.xlsx格式的Excel表格文件")
                return false
            }
        },
        handleDetailUploadSuccess(response, file, fileList) {
            var newFile = {
                name: file.name,
                url: window.qiniuHost + response.key
            }
            this.fileDetailUploadList = []
            this.fileDetailUploadList.push(newFile)
        },
        handleDetailRemove(){
            this.fileDetailUploadList = []
        },
        handleUploadError(error, file, fileList) {
            const _this = this
            _this.$message.error('上传失败')
        },
        handleBeforUpload(file) {
            // console.log("file",file)
            const _this = this
            var suffix = file.name.split('.')
            this.uploadData.key = new Date().getTime() + '.' + suffix[1]
            this.uploadData.token = this.$store.state.qiniuToken
            return this.qiniuyunup(_this, file)
        },
        save(){//提交导入的文件URL
            var _this=this
            // console.log(this.fileDetailUploadList)
            if(this.fileDetailUploadList.length>1){
                this.$message.error("只能上传一个文件")
                return
            }
            if(this.fileDetailUploadList.length==0){
                this.$message.error("请上传文件")
                return
            }
            var pp=new URLSearchParams()
            if(this.$store.state.shiro){
                this.$message.error("您没有权限添加")
                return
            }
            pp.append('shopId',this.$store.state.TOPshopID)
            pp.append('url',this.fileDetailUploadList[0].url)
            axios.get("/addStockByExcel.do",{params:pp}).then(r=>{
                if(r.data.code==200){
                    _this.$message.success("提交成功")
                    _this.$store.state.createruku=false
                    _this.close()
                }else{
                    _this.$message.error(r.data.message)
                }
            })
        }
    }
} 
</script>
<style>
.w{
    width: 165px;
    margin-left: 10px;
}
.mgt{
    margin-top: 20px;
}
.flr{
    float: right;
}
</style>
